<script setup lang='ts'>
import { MessageType } from '@/models/like';
import { useRouter } from 'vue-router';

const router = useRouter()
interface LikeListProps {
  likeList:MessageType[]
}
const props = withDefaults(defineProps<LikeListProps>(),{
  likeList: []
})
// 去帖子页面
const toBlog = (id:any) => {
  router.push({
    path: '/blog/detail',
    query: {
      id
    }
  })
}
</script>
<template>
  <van-cell-group v-for="like in likeList" >
    <van-cell :title="like.fromUser.username" :border="false">
      <template #icon>
         <van-image fit="fill" class="team_img" round :src="like.fromUser.avatarUrl" />
      </template>
      <template #title>
        <span class="title">{{ like.fromUser.username }}</span>
      </template>
      <template #label>
        <span class="title">{{ like.createTime }}</span>
        <span style="margin-left: 5px;">{{ like.type===0? '赞了你的帖子': '赞了你的评论' }}</span>
      </template>
    </van-cell>
    <van-cell @click="toBlog(like.blog?.id)" v-if="like.type === 0" :title="like.fromUser.username" class="likeContent" :border="false">
      <template #right-icon v-if="like.blog?.coverImage">
         <van-image fit="fill" class="team_img" :src="like.blog?.coverImage" />
      </template>
      <template #title>
        <span class="title">{{ like.blog?.title }}</span>
      </template>
      <template #label>
        <span class="title">{{ like.blog?.content }}</span>
      </template>
    </van-cell>
    <div v-else @click="toBlog(like.comment?.blogId)" :title="like.fromUser.username" class="likeContent">
      <van-text-ellipsis class="comment" :content="like.comment?.content" rows="2"/>
    </div>
  </van-cell-group>
</template>
<style scoped >
.team_img{
  height: 40px;
  width: 40px;
}
.title{
  margin-left: 10px;
}
.likeContent{
  width: 350px;
  height: 60px;
  background-color: #ededed;
  margin: 0 16px;
}
.comment{
  padding: 10px 16px;
  font-size: 14px;
}
</style>
